﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/ezdesk_app_template.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- InstanceBeginEditable name="pageTitle" -->
    <title>易得桌面</title>
    <!-- InstanceEndEditable -->
<link href="Content/jquery-ui.custom.css" rel="stylesheet" type="text/css" />
<link href="Content/ui.textbox.css" type="text/css" rel="stylesheet"  media="all" />
<link href="Content/freecontent.css" rel="stylesheet" type="text/css" />
<link href="Content/wdatepicker.css" rel="stylesheet" type="text/css" />
<link href="Content/ajaxbusy.css" rel="stylesheet" type="text/css" />
<link href="Content/Site.css" rel="stylesheet" type="text/css" />

<script src="Scripts/ezdesk_mockdata.js" type="text/javascript"></script>
<script src="Scripts/jquery.js" type="text/javascript"></script>
<script src="Scripts/jquery-ui.custom.min.js" type="text/javascript"></script>   
<script src="Scripts/jquery.form.js" type="text/javascript"></script>
<script src="Scripts/ui.textbox.js" type="text/javascript"></script>
<script src="Scripts/pinyin.js" type="text/javascript"></script>
    <script src="Scripts/ezdesk-jquery-ui.js" type="text/javascript"></script>
    <script src="Scripts/ezdesk_common.js" type="text/javascript"></script>
</head>

<!-- InstanceBeginEditable name="pageStyles" -->
    <style type="text/css">
        .cmbName
        {
            display: inline-block;
            font-size: 18px;
            color: #666;
        }
        .cmbValue
        {
            display: inline-block;
            font-size: 18px;
        }
        select
        {
            font: 14px/1.5 微软雅黑,Tahoma,Helvetica,arial,sans-serif;
            margin-top: 4px;
        }
        .entryExplanation
        {
            font-weight: bolder;
            font-size: 14px;
            background-color: #FFEC8B;
        }
    </style>
    <!-- InstanceEndEditable -->
    
<!-- InstanceBeginEditable name="pageScripts" -->
<script type="text/javascript">
    //************* URL常量
    var URL_MODIFY_OPTIONS = "";
    //************* 全局变量
    var g_Var = {
};
//************* 常量定义
var StaticResource = {
};
//************* Accessor访问器

var EzAccessor = {};

function CreateAccessor() {
    if (ezmock.IS_MOCKED) {
        EzAccessor = CreateMockEzAccessor();

    } else {
        EzAccessor = CreateRealEzAccessor();
    }
}


function CreateMockEzAccessor() {
    //模拟实现服务器交互方法
    var mock_CurrentTime = { 'CurrentTime': '1280423559' };
    var mockEzAccessor = {
        'getCurrentTime': function () {
            return Date.fromEpoch(mock_CurrentTime['CurrentTime']);
        },

        'doModifyOptions': function (dateNow) {
            var onDutyTimeEpoch = getTimeEpoch("onDutyTime", dateNow);
            var offDutyTimeEpoch = getTimeEpoch("offDutyTime", dateNow);
            var attendanceDelayTime = $('#attendanceDelayTime').val();
            var annualLeaveTime = $('#annualLeaveTime').val();

            var stateInfo = { 'State': 'Success', 'Info': '设置成功！', 'Date': null };
            $.displayStateInfo(stateInfo);
        }
    };

    return mockEzAccessor;
}

function CreateRealEzAccessor() {
    //实现服务器交互方法
    var realEzAccessor = {
        'doModifyOpitons': function (dateNow) {
            var onDutyTimeEpoch = getTimeEpoch("onDutyTime", dateNow);
            var offDutyTimeEpoch = getTimeEpoch("offDutyTime", dateNow);

            var attendanceDelayTime = $('#attendanceDelayTime').val();
            var annualLeaveTime = $('#annualLeaveTime').val();

            $(this).ajaxBusy('begin');
            $.post(
                    URL_MODIFY_OPTIONS,
                    {
                        'onDutyTime': onDutyTimeEpoch,
                        'offDutyTime': offDutyTimeEpoch,
                        'attendanceDelayTime': attendanceDelayTime,
                        'annualLeaveTime': annualLeaveTime
                    },
                    function (e) {
                        $(this).ajaxBusy('end');
                        $.displayStateInfo(e);
                        if (e.State == "Success") {

                        }
                    }
            )
        }
    };

    return realEzAccessor;
}

//获取时间的Epoch
function getTimeEpoch(timeSelector, dateNow) {
    var timeFormat = $('#' + timeSelector).timePicker('getTime');
    //var offDutyTime = $('#offDutyTIme').timePicker('getTime');

    var timeToEpoch = new Date(
                dateNow.getFullYear(),
                dateNow.getMonth(),
                dateNow.getDate(),
                timeFormat.getHours(),
                timeFormat.getMinutes(),
                0
            ).toEpoch();

    return timeToEpoch;

}

function timeBeginChanged(currentTime) {
    var onDutyTime = $('#onDutyTime').timePicker('getTime');
    var offDutyTIme = $('#offDutyTime').timePicker('getTime');
    if (onDutyTime > offDutyTIme) {
        $('#timeBegin').timePicker('setTime', offDutyTIme);
        EzTipsManager.showTipBox('tipAlert');

        setTimeout(function () {
            EzTipsManager.hideTipBox('tipAlert');
        }, 3000);
    }
}


function timeEndChanged(currentTime) {
    var onDutyTime = $('#onDutyTime').timePicker('getTime');
    var offDutyTIme = $('#offDutyTime').timePicker('getTime');
    if (onDutyTime > offDutyTIme) {
        $('#timeEnd').timePicker('setTime', onDutyTime);
        EzTipsManager.showTipBox('tipAlert');

        setTimeout(function () {
            EzTipsManager.hideTipBox('tipAlert');
        }, 3000);
    }
}


function initPage() {
    EzTipsManager.addTipBox('#tip_Remind', 'tipRemind');
    EzTipsManager.showTipBox('tipRemind');

    CreateAccessor();

    $('#onDutyTime').timePicker(
        { hourList: [6, 7, 8, 9, 10],
            minuteList: [0, 30],
            'select': function (event, currentTime) {
                timeBeginChanged(currentTime)
            }
        });

    $('#offDutyTime').timePicker(
        { hourList: [17, 18, 19, 20, 21],
            minuteList: [0, 30],
            select: function (event, currentTime) {
                timeEndChanged(currentTime)
            }
        });

    $("#attendanceDelayTime").autocomplete({ minLength: 0, source: ["5", "10", "15", "20", "25"] });

    $("#annualLeaveTime").autocomplete({ minLength: 0, source: ["3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "20"] });

}
function initPageEvent() {
    var dateNow = EzAccessor.getCurrentTime();
    $('#setSubmit').click(function () {
        if ($('#attendanceDelayTime').val() && $('#annualLeaveTime').val()) {
            EzAccessor.doModifyOptions(dateNow);
        }
        else {
            var stateInfo = { "State": "Error", "Info": "假期长度或考勤弹性时间不能为空！", "Data": null };
            $.displayStateInfo(stateInfo);
        }

    });


    //todo..
    $('#setCancel').click(function () {
        $('#attendanceDelayTime').clearFields();
        $('#annualLeaveTime').clearFields();

    });

}
$(function () {
    initPage();
    initPageEvent();
});
</script>
<!-- InstanceEndEditable -->



<body>
<div id="root">
	<div id="headw">
    	<div id="head">
            <!-- InstanceBeginEditable name="pageHead" -->
                <h1>
                    考勤设置</h1>
                <div id="status-bar">
                    <span>早上好，杨裕欣(软件工程部)</span> <span><a href="#">设置</a></span>
                </div>
                <div id="ezdesk-bar">
                    魏玛软件出品</div>
                <div id="tabs" style="display: none;">
                    这里是tabs</div>
                <!-- InstanceEndEditable -->
        </div>
    </div>
    <div id="main">
    
    	<div id="contentw">
            <div id="content-page">
	            <!-- InstanceBeginEditable name="pageContent" -->
                    <div id="page-head">
                        <span id="lblTittle">考勤基本设置</span>
                    </div>
                    <div id="page-body">
                        <div style="margin: 10px 0 0 0;">
                            <div>
                                <span class="entryExplanation">设置上下班时间</span> <span>在正常上班情况下，扣除中午休息1个小时时间，保证每天8个小时的工作时间。</span>
                            </div>
                            <div class="formBox">
                                <div>
                                    <div class="cmbName">
                                        <label>
                                            上班时间：
                                        </label>
                                    </div>
                                    <div id="onDutyTime" class="cmbValue">
                                    </div>
                                </div>
                                <div>
                                    <div class="cmbName">
                                        <label>
                                            下班时间：
                                        </label>
                                    </div>
                                    <div id="offDutyTime" class="cmbValue">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div style="margin: 10px 0 0 0;">
                            <div>
                                <span class="entryExplanation">设置考勤延迟时间</span> <span>上班考勤迟到时间在延迟时间以内，不作为上班迟到处理；同样下班考勤早退在延迟时间以内，不作为下班早退处理。</span>
                            </div>
                            <div class="formBox">
                                <div>
                                    <div class="cmbName">
                                        <label>
                                            考勤延迟时间：
                                        </label>
                                    </div>
                                    <div class="cmbValue">
                                        <input id="attendanceDelayTime" style="width: 40px;" />
                                        <span>分钟</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div style="margin: 10px 0 0 0;">
                            <div>
                                <span class="entryExplanation">设置默认调休假期时间</span> <span>统一设置员工默认的调休假期时间，点击下面链接可以进行详细的设置。</span>
                            </div>
                            <div class="formBox">
                                <div>
                                    <div class="cmbName">
                                        <label>
                                            默认调休天数：
                                        </label>
                                    </div>
                                    <div class="cmbValue">
                                        <input id="annualLeaveTime" style="width: 40px;" />
                                        <span>天 </span>
                                    </div>
                                    <p style="color: Red;">
                                        如果需要对个人进行特殊设置，请点击 <a href="#">这里</a>
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="page-submit">
                        <input id="setSubmit" style="width: 80px;" type="button" value="确定" />
                        或者 <a id="setCancel">取消</a>
                    </div>
            <!-- InstanceEndEditable -->
            </div>
            <div id="content-foot"><small>这个是内容下面的脚注</small></div>
        </div>        
        
        <div id="tipsw">
	        <!-- InstanceBeginEditable name="pageShortcut" -->
            <!-- InstanceEndEditable -->            
            <div id="tips" class="box">
           	
            </div>
        </div>
        <div class="clearfloat"></div>
    </div> 
</div>
	    <!-- InstanceBeginEditable name="pageFoot" -->
    <div id="tip_Remind" style="display: none;">
        <h1>
            小贴士:</h1>
        <p class="indent">
            设置一些考勤的基本信息。
        </p>
    </div>
    <!-- InstanceEndEditable -->    
</body>
<!-- InstanceEnd --></html>
